<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
	<title>厕所评价</title>
	<link rel="stylesheet" type="text/css" href="../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../css/fonts/css/font-awesome.min.css" />
	<style>
		#main{
		}
		#banner{
			text-align: center; 
			background-image: -webkit-linear-gradient(left, #ea8610, #e57305);
			background-image:         linear-gradient(left, #ea8610, #e57305);
			padding: 20px 0 40px;
		}
		#banner img{
			display: inline-block; width: 100px; height: 100px;
			border-radius: 100px;
			border: 2px solid #fff; background-color: #f5eee9;
		}
		#banner .title{
			font-size: 18px; color: #fff; margin: 10px 0;
		}
		#banner .star{
			color: #ffd54c; font-size: 20px;
		}
		#list li{
			padding: 20px 10px; border-bottom: 1px solid #d4d4d4;
		}
		#list .row{
			overflow: hidden;
		}
		#list .customer{
			float: left; color: #9b9b9b;
		}
		#list .star{
			float: right; color: #ffb84d;
		}
		#list .word{
			color: #333; font-size: 18px; margin-top: 10px;
		}

	</style>
</head>
<body>
	<div id="main">
		<div id="banner">
			<img src="../image/wc.png" />
			<div class="title">公共厕所</div>
			<div class="star">
				<i class="fa fa-star"></i>
				<i class="fa fa-star"></i>
				<i class="fa fa-star"></i>
				<i class="fa fa-star"></i>
				<i class="fa fa fa-star-o"></i>
			</div>
		</div>
		<ul id="list">
			<li>
				<div class="row">
					<div class="customer">
						188******41 03-06 00:14
					</div>
					<div class="star">
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star-o"></i>
					</div>
				</div>
				<div class="word">
					味道好极了！
				</div>
			</li>
			<li>
				<div class="row">
					<div class="customer">
						186******18 02-26 19:09
					</div>
					<div class="star">
						<i class="fa fa-star"></i>
						<i class="fa fa-star-o"></i>
						<i class="fa fa-star-o"></i>
						<i class="fa fa-star-o"></i>
						<i class="fa fa-star-o"></i>
					</div>
				</div>
				<div class="word">
					f**k！怎么没有纸了！！！
				</div>
			</li>
			<li>
				<div class="row">
					<div class="customer">
						136******25 02-11 07:25
					</div>
					<div class="star">
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
					</div>
				</div>
				<div class="word">
					好！
				</div>
			</li>
			<li>
				<div class="row">
					<div class="customer">
						158******95 02-10 01:54
					</div>
					<div class="star">
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star-o"></i>
						<i class="fa fa-star-o"></i>
					</div>
				</div>
				<div class="word">
					总体还可以！网速不错~
				</div>
			</li>
			<li>
				<div class="row">
					<div class="customer">
						131******79 02-02 04:34
					</div>
					<div class="star">
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
					</div>
				</div>
				<div class="word">
					很好！第二次光顾了~
				</div>
			</li>
			<li>
				<div class="row">
					<div class="customer">
						189******11 02-01 00:39
					</div>
					<div class="star">
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star"></i>
						<i class="fa fa-star-o"></i>
					</div>
				</div>
				<div class="word">
					有点远！
				</div>
			</li>
		</ul>
	</div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<!-- <script type="text/javascript" src="../script/zepto.js"></script> -->
<script>
	apiready = function(){

	};
</script>
</html>
